﻿import React, { Component } from 'react'
import PropTypes from 'prop-types'
import './staffNode.css'
import '../common/common.css'
import Expandable from '../common/Expandable'
const LEVELS = {1: '科级', 2: '科级,科室负责人', 4: '处级', 8: '处级,部门负责人', 16: '校领导' };
export default class StaffNode extends Component {
    static propTypes = {
        name: PropTypes.string.isRequired,
        expanded: PropTypes.bool,
        teachers: PropTypes.array,
        children: PropTypes.array,
        onExpand: PropTypes.func.isRequired
    }
    render() {
        return (
            <div>
                <Expandable
                    text={this.props.name}
                    expanded={this.props.expanded === true}
                    onExpand={this.props.onExpand} />
                {this.props.expanded === true && <div className="indent-children">
                    {this.props.teachers && this.props.teachers.map(t => (
                        <div key={t.eno}>{t.name}{t.level > 0 ? `(${LEVELS[t.level]})` : ''}</div>
                    ))}
                    {this.props.children && this.props.children.map((c, idx) => (
                        <StaffNode key={idx}
                            name={c.name}
                            expanded={c.expanded}
                            teachers={c.teachers}
                            children={c.children}
                            onExpand={this.props.onExpand}
                        />
                    ))}
                </div>}
            </div>
        )
    }
}